<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <button>btn</button>
    <br />
    <img
      src="https://api.map.baidu.com/staticimage/v2?ak=izUj26u1CBbPdaKZjWfs6tPzIhOMtzaK&mcode=666666&center=116.403874,39.914888&width=300&height=200&zoom=11"
      alt=""
    />
    <script>
      // console.log(navigator.geolocation);
      document.querySelector("button").onclick = function () {
        // navigator.geolocation.getCurrentPosition(function (position) {
        //   console.log("获取到位置", position.coords);
        //   document.querySelector(
        //     "img"
        //   ).src = `https://api.map.baidu.com/staticimage/v2?ak=izUj26u1CBbPdaKZjWfs6tPzIhOMtzaK&mcode=666666&center=${position.coords.longitude},${position.coords.latitude}&width=500&height=500&zoom=15`;
        // });

        navigator.geolocation.watchPosition(function (position) {
          console.log("位置变化了", position.coords);
        });
      };
      //   经纬度  精度   三角定位原理
      //   AGPS基站定位 公里  GPS/北斗 5m  WIFI/WLAN 设备=> MAC网卡 30M
      //   室内 WIFI  蓝牙===>
      //   坐标系 wgs84 可能需要转换
    </script>
  </body>
</html>
